<!DOCTYPE html>
<html>
<head>
    <title>Media Query test</title>
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" href="css/test-suite.css">
</head>
<body>
    <div class="main">
    
        <div class="test-group box">
            
            <div class="test box setup">
                <div class="test-condition">
                    <p>Setup</p>
                </div>
            </div>
            
           <div class="test box deferred-setup">
               <div class="test-condition">
                   <p>Deferred setup</p>
               </div>
           </div>   
            
            <div class="test box match">
                <div class="test-condition">
                    <p>Match</p>
                </div>
            </div>
            
            <div class="test box unmatch">
                <div class="test-condition">
                    <p>Unmatch</p>
                </div>
            </div>
            
            <div class="test box destroy">
                <div class="test-condition">
                    <p>Destroy</p>
                </div>
            </div>
            
            <div class="test box should-degrade incapable-only">
                <div class="test-condition">
                    <p>Degrade <small>only passes for incapable browsers</small></p>
                </div>
            </div>
            
        </div>
            
    </div>
    
    <script src="../dist/enquire.js"></script>
    <script src="js/test-suite.js"></script>

</body>
</html>